<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增虚拟用况组')" />
    <th:block th:include="include :: select2-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-virtualUsageGroup-add">
            <input name="interfaceId" type="hidden" th:value="${interfaceId}">
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">组名称：</label>
                <div class="col-sm-8">
                    <input name="groupName" class="form-control" type="text" required>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">组描述：</label>
                <div class="col-sm-8">
                    <textarea name="groupDescription" class="form-control"></textarea>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">动词：</label>
                <div class="col-sm-8">
                    <select name="operateType" id="operateType" class="form-control m-b" th:with="type=${@dict.getType('operateType')}">
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">归属域：</label>
                <div class="col-sm-8">
                    <select name="domainId" id="domainId" class="form-control m-b" required>
                        <option th:each="dict : ${domainInfoList}" th:text="${dict.domainName}" th:value="${dict.id}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label is-required">归属域对象：</label>
                <div class="col-sm-8">
                    <select name="domainObjectId" id="domainObjectId" class="form-control m-b" required>
                        <option th:each="dict : ${domainObjectList}" th:text="${dict.objectName}" th:value="${dict.id}"></option>
                    </select>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label is-required">方法名称：</label>
                <div class="col-sm-8">
                    <input  name="methodName" id="methodName" type="text" class="form-control" placeholder="输入方法名称" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">入参DTO名称：</label>
                <div class="col-sm-8">
                    <input name="inParamDtoName" id="inParamDtoName" class="form-control" type="text" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">出参DTO名称：</label>
                <div class="col-sm-8">
                    <input name="outParamDtoName" id="outParamDtoName" class="form-control" type="text" required>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: select2-js" />
    <script th:inline="javascript">
        var prefix = ctx + "virtualUsageGroup/virtualUsageGroup"
        $("#form-virtualUsageGroup-add").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                var config = {
                    url: prefix + "/add",
                    type: "post",
                    async: false,
                    dataType: "json",
                    data: $('#form-virtualUsageGroup-add').serialize(),
                    beforeSend: function () {
                        $.modal.loading("正在处理中，请稍后...");
                        $.modal.disable();
                    },
                    success: function(result) {
                        $.modal.closeLoading();
                        if (result.code == web_status.SUCCESS) {
                            $.modal.close();
                        } else {
                            $.modal.alertWarning(result.msg);
                        }
                    }
                };
                $.ajax(config)
            }
        }
        var domainInfoList = [[${domainInfoList}]];
        var domainObjectList = [[${domainObjectList}]];
        $(function () {
            $('body').on('change', '#domainId', function () {
                var id = $(this).val();
                var config = {
                    url: ctx + "domainInfo/domainInfo/domainObjectList?id="+id,
                    type: "POST",
                    dataType: "json",
                    data: null,
                    beforeSend: function () {
                        $.modal.loading("正在处理中，请稍后...");
                    },
                    success: function(result) {
                        $.modal.closeLoading();
                        $("#domainObjectId").empty();
                        domainObjectList = null;
                        if (result.data && result.data.length > 0) {
                            domainObjectList = result.data;
                            for (var i=0; i<result.data.length; i++) {
                                $("#domainObjectId").append("<option value='"+result.data[i].id+"'>"+result.data[i].objectName+"</option>");
                            }
                        }
                        changeData()
                    }
                };
                $.ajax(config);
            }).on('change', '#domainObjectId', function () {
                changeData();
            }).on('change', '#operateType', function () {
                changeData();
            })
        })


        function changeData() {
            var domainId = $("#domainId").val();
            var domainObjectId = $("#domainObjectId").val();
            var operateType = $('#operateType').val();

            $("#methodName").val('');
            $("#inParamDtoName").val('');
            $("#outParamDtoName").val('');
            var objectEnName = null, domainEnName = null;

            if (domainId) {
                for(var i=0; i < domainInfoList.length; i++) {
                    if (domainId == domainInfoList[i].id) {
                        domainEnName = domainInfoList[i].domainEnName;
                        break;
                    }
                }
            } else {
                return;
            }
            if (domainObjectId) {
                for(var i=0; i < domainObjectList.length; i++) {
                    if (domainObjectId == domainObjectList[i].id) {
                        objectEnName = domainObjectList[i].objectEnName;
                        break;
                    }
                }
            } else {
                return;
            }
            $("#inParamDtoName").val(objectEnName + "ReqDto");
            $("#outParamDtoName").val(objectEnName + "RespDto");
            var tail;
            objectEnName = objectEnName.charAt(0).toUpperCase() + objectEnName.slice(1);
            if (operateType.indexOf('_') >= 0) {
                tail = operateType.replace("_", objectEnName);
            } else {
                tail = operateType + objectEnName
            }
            $("#methodName").val(tail);

        }
    </script>
</body>
</html>